<style lang="scss" scoped>
	.content {

		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.nav {
		width: 100%;
		position: fixed;
		top: 0;
		left: 0;
	}

	.top {
		padding: 20rpx 0;
	}

	.search {
		width: 690rpx;
		height: 68rpx;
		background: #f4f5f7;
		border: 2rpx solid #f5f5f5;
		border-radius: 46rpx;
		margin: 0rpx auto;
		padding: 20rpx;

		.ipt {
			flex: 1;
		}
	}

	.footer {
		width: 100%;
		background-color: white;
		position: fixed;
		bottom: 0;
		left: 0;
		border-top: 1px solid #cccccc;
		padding-left: 30rpx;
		padding-right: 30rpx;
		z-index: 100;
	}

	.box {
		width: 690rpx;
		padding: 30rpx 20rpx;
		background: #ffffff;
		border-radius: 20rpx;
		box-shadow: 0rpx 32rpx 20rpx -20rpx #e6ebf2;
		margin-top: 30rpx;

		.t1 {
			width: 150rpx;

		}

	}

	.btns {
		.btn {

			padding: 10rpx 30rpx;
			border: 2rpx solid #409eff;
			border-radius: 34rpx;
		}
	}

	.sbtn {
		width: 210rpx;
		height: 88rpx;
		border: 2rpx solid #dee2ee;
		border-radius: 46rpx;
		border: 2rpx solid #409eff;
	}

	.lbtn {
		width: 210rpx;
		height: 88rpx;
		margin-right: 0;
	}

	.tip {
		color: #98A5B3;
		padding: 0 30rpx;
		width: 100%;
	}

	.top {
		width: 100%;
		height: 170rpx;

		.ball {
			width: 60rpx;
			height: 60rpx;
			border-radius: 50%;
			background: #dee2ee;
			font-size: 20rpx;
			margin-bottom: 10rpx;
		}

		.rowline {
			width: 130rpx;
			height: 4rpx;
			background: #dee2ee;
			border-radius: 4rpx;
			transform: translateY(-20rpx);
		}

		.blue {
			background: #409eff;
			color: white
		}

		.green {
			border: 2rpx solid #07c160;
			background-color: white;
			color: #07c160;
		}
	}

	.plan {
		width: 100%;
		border-top: 1px solid #eee;
		margin-top: 30rpx;

		line-height: 60rpx;

		.one {
			width: 500rpx;
		}
	}
</style>

<template>
	<view class="content">
		<view class="top bgwhite center-flex">
			<view class="colum-flex">
				<view class="ball center-flex green">
					<u-icon name="checkbox-mark" size="30"></u-icon>
				</view>
				<view>基本信息</view>
			</view>
			<view class="rowline" style="background-color:#07c160 ;"></view>
			<view class="colum-flex ">
				<view class="ball center-flex green">
					<u-icon name="checkbox-mark" size="30"></u-icon>
				</view>
				<view>制定里程碑</view>
			</view>
			<view class="rowline" style="background-color:#07c160 ;"></view>
			<view class="colum-flex">
				<view class="ball center-flex blue">
					3
				</view>
				<view>制定任务</view>
			</view>

		</view>

		<view class="box" v-for="item,index in work" :key="index">
			<view class="p-bottom30 between-flex">
				<view class="textColor f28 bold ">里程碑{{item.indexNum}}</view>
				<view class="align-flex blue" @click="add(item)">
					<u-icon name="plus-circle"></u-icon>添加任务
				</view>
			</view>
			<view class="gray  align-flex">
				<view class=" t1">名称</view>
				<view class="textColor ">{{item.name}}</view>
			</view>
			<view class="gray  align-flex m-top20">
				<view class=" t1">负责人</view>
				<view class="textColor ">{{item.principal | user}}</view>
			</view>
			<view class="gray  flex m-top20">
				<view class="t1 ">详细描述</view>
				<view class="textColor " style="width:500rpx;">{{item.remark}}</view>
			</view>
			<view class="plan" v-if="item.children.length>0">
				<view class="gray bold">任务</view>
				<view class="between-flex m-bottom20" v-for="item2,index2 in item.children" :key="index2"
					:style="item2.quoteId==1?'background:#dee2ee;':''">
					<view class="one textColor">{{item2.indexNum}}{{item2.name}}</view>
					<view class="align-flex blue" @click="showChoose(item2,item.indexNum,item.id)">
						<image src="../../static/images/caozuo.png" mode=""
							style="width:30rpx;height:30rpx;margin-right: 10rpx;"></image>操作
					</view>
				</view>

			</view>
		</view>


		<view class="space"></view>
		<view class="footer between-flex paddingBottom">
			<view class="sbtn center-flex blue bold" @click="$back">上一步</view>
			<view class="lbtn" style="background: #13bf65;" @click="save">保存</view>
			<view class="lbtn" @click="submit">提交</view>
		</view>
		<u-popup mode="bottom" v-model="showPopup" :closeable="true" borderRadius="20" height="90%">
			<addplan v-if="showPopup" :plan="plan" :list="originlist" @submit="showPopup=false;getlist()"></addplan>
		</u-popup>
		<u-popup mode="bottom" v-model="showEdit" :closeable="true" borderRadius="20" height="90%">
			<editplan v-if="showEdit" :list="originlist" @submit="showEdit=false;getlist()"></editplan>
		</u-popup>
		<u-action-sheet :list="action" @click="click" v-model="showSheet"></u-action-sheet>
	</view>
</template>

<script>
	import addplan from '@/pagesProject/operation/addplan.vue'
	import editplan from '@/pagesProject/operation/editplan.vue'
		import PagesDemandRouterConfig from  '@/pagesDemand/routerConfig.js'
	export default {
		components: {
			addplan,
			editplan
		},
		data() {
			return {
				head: this.$head,
				project: uni.getStorageSync('creatProjectInfo'),
				work: [],
				plan: {},
				showPopup: false,
				showEdit: false,
				showSheet: false,
				action: [{
						text: '编辑'
					},
					{
						text: '添加子任务'
					},
					{
						text: '删除'
					}
				],
				job: {}, //当前选中任务
				originlist:[]//原始任务数组

			}
		},
		onLoad() {
			this.getlist()

		},

		methods: {
			click(index) {
				console.log(`点击了第${index + 1}项，内容为：${this.action[index].text}`)
				// if (index == 0) {
				// 	this.$navTo( this.PagesDemandRouterConfig.AddDemand+'?type=2&itemCode='+this.itemCode+'&id='+this.info.id)
				// } 
				if (this.job.quoteId == 1) {
					if (index == 0) {
						this.plan = this.job
						this.showPopup = true
					}else if(index==1){
						this.del()
					}
				} else {
					if (index == 0) {
						this.edit()
					} else if (index == 1) {
						this.plan = this.job
						this.showPopup = true
					}else if (index == 2) {
						this.del()
					}
				}

			},
			showChoose(item, index, id) {
				var indexNum=item.indexNum.split('.')
				indexNum.splice(indexNum.length-1,1)
				item.parentIndex = indexNum.join('.')
				this.job = item
				if (this.job.quoteId == 1) {
					this.action = [
						{
							text: '添加子任务'
						},
						{
							text: '删除'
						}
					]
				} else {
					this.action = [{
							text: '编辑'
						},
						{
							text: '添加子任务'
						},
						{
							text: '删除'
						}
					]
				}
				this.showSheet = true

			},
			del() {
				this.$showloading()
				this.$pop.ajaxPost('/busItemWork/delete', {
					id: this.job.id
				}).then(res => {
					uni.hideLoading()
					if (res.code == 0) {
						this.getlist()
					} else {
						this.$msg(res.msg)
					}
				})
			},
			edit() {

				this.showEdit = true

				setTimeout(() => {
					uni.$emit('chooseplan', this.job)
				}, 200)

			},
			add(item) {
				this.plan = item
				this.showPopup = true
			},
			getlist() {
				this.$pop.ajaxPost('/busItemInfo/getWorkList', {
					itemCode: this.project.itemCode
				}).then(res => {
					
					this.work = []
					var list = res.body
					var list2=[]
					this.originlist=this.$u.deepClone(list)
					
					this.plan = list[1]
					list.forEach((item,index) => {
						if (item.parentId == 0) {
							item.children = []
							this.work.push(item)
							
						}else{
							list2.push(item)
						}
					})
					console.log('list2',list2)
					this.work.forEach(item => {
						list2.forEach(item2 => {
							var indexNum1=item.indexNum.split('.')[0]
							var indexNum2=item2.indexNum.split('.')[0]
							if (indexNum1 == indexNum2) {
								item.children.push(item2)
							}
						})
					})

					
				})
			},
			save() {
				this.$showloading()
				var obj = uni.getStorageSync('creatProjectInfo')
				this.$pop.ajaxPost('/busItemInfo/save', obj).then((res) => {
					uni.hideLoading()

					this.$msg(res.msg)

				})
			},
			submit() {
				this.$showloading()

				this.$pop.ajaxPost('/busItemInfo/confirm', this.project).then((res) => {
					uni.hideLoading()
					if (res.code == 0) {
						this.$msg(res.msg)
						setTimeout(() => {
							if(uni.getStorageSync('from')==2){
								uni.navigateBack({
									delta: 4
								})
							}else{
								uni.navigateBack({
									delta: 3
								})
							}
							
						}, 1500)

					} else {
						this.$msg(res.msg)
					}
				})

			},




		}
	}
</script>
